<!--
- Author:  LiShibin.
- Date:    2017/7/27 0027.
- File:    pay.
-->
<template>
  <div class="coupbg" v-show="show">
    <div class="PopBg" @click="closePop"></div>
    <div class="coupon_box" style="z-index: 99; max-height: 10rem; overflow-y: scroll">
      <h3>领取优惠券</h3>
      <div class="couponlist f-cb" v-for="coupon in couponList.data">
        <div class="fl">
          <p class="c_class">类型：{{coupon.voucher_t_type | couponTypeTxt}}</p>
          <p class="c_time">{{coupon.voucher_t_start_date | timestampToDate('yyyy.MM.dd')}}-{{coupon.voucher_t_end_date | timestampToDate('yyyy.MM.dd')}}</p>
          <p class="c_money">{{coupon.voucher_t_limit | couponUseTxt}}</p>
        </div>
        <div class="fr">
          <p class="c_price">￥<span>{{coupon.voucher_t_price}}</span></p>
          <div class="c_receive" @click="receiveCoupon(coupon.voucher_t_id)">立即领取</div>
        </div>
      </div>
      <div class="c_btn" @click="closePop">关闭</div>
    </div>
  </div>
</template>

<script>
  export default{
    data() {
      return {
        show: false,
        param: {}, // {storeId: ''}
        couponList: {requested: false, data: []},
        closedHandle: function () {
        }
      }
    },
    components: {},
    watch: {
      show(val) {
        if (val) {
          this.$utils.addBodyFix() // 显示模态框，防止滚动模态框里的div时body也滚动
        } else {
          this.$utils.removeBodyFix()
        }
      }
    },
    created() {
      setTimeout(() => {
        this.getCouponList()
      }, 50)
    },
    methods: {
      switchShow(boolValue) {
        this.show = boolValue
      },
      closePop() {
        this.switchShow(false)
        this.closedHandle()
      },
      getCouponList() {
        this.$request.getStoreCouponList(this.param.storeId).then(data => {
          this.couponList.data = data
        }).finally(() => {
          this.couponList.requested = true
        })
      },
      receiveCoupon(couponId) {
        this.$request.receiveCoupon(couponId).then(data => {
          this.$toast('领取成功')
        }).catch(e => {
          this.$toast('领取失败:' + e.msg)
        })
      }
    }
  }
</script>

<style>

</style>